import styles from './index.scss'
import ReactSVG from 'react-svg'
import LongButton from '../LongButton'
const Artificial = ({buttonData}) => {
  return (
    <div className={styles.artificialContainer}>
      <div className={styles.artHeader}>
        <ReactSVG src="svg/head/back.svg" svgClassName={styles.back} />
        <div className={styles.peopleWait}>
          当前有 <span className={styles.peopleNum}>6 </span>
          个人正在等待
        </div>
        <div className={styles.bigTitle}>人工视频见证</div>
        <div className={styles.imageSize}></div>
      </div>
      <div className={styles.videoTip}>
        <div className={styles.tipTitle}>
          您即将进入人工视频见证,请注意以下事项
        </div>
        <div className={styles.logoTip}>
          <div className={styles.logoContainer}>
            <ReactSVG src="svg/video/sun.svg" svgClassName={styles.logo} />
            <div>
              确保光线充足
            </div>
          </div>
          <div className={styles.logoContainer}>
            <ReactSVG src="svg/video/novoice.svg" svgClassName={styles.logo} />
            <div>确保周围环境安静</div>
          </div>
          <div className={styles.logoContainer}>
            <ReactSVG src="svg/video/wifi.svg" svgClassName={styles.logo} />
            <div>WIFI或4G网络</div>
          </div>
        </div>
        <div className={styles.buttonSize}>
            <LongButton {...buttonData}></LongButton>
        </div>
      </div>
    </div>
  )
}
export default Artificial
